import Vue from 'vue'
import VueRouter from 'vue-router'
import Index from '../views/index'

import pageOne from '../views/PageOne'
import pageTwo from '../views/PageTwo'
import pageThree from '../views/PageThree'
import pageFour from '../views/PageFour'



Vue.use(VueRouter)

const routes = [
    {
        path: '/',
        name: '导航一',

        redirect: '/PageOne',
        component: Index,
        children:[
            {
                path: '/PageOne',
                name: '页面一',
                component: pageOne
            },
            {
                path: '/PageTwo',
                name: '页面二',
                component: pageTwo
            }
        ]
    },
    {
        path: '/nav',
        name: '导航二',
        component: Index,
        children:[
            {
                path: '/PageThree',
                name: '页面三',
                component: pageThree
            },
            {
                path: '/PageFour',
                name: '页面四',
                component: pageFour
            }
        ]
    }

  // {
  //   path: '/about',
  //   name: 'About',
  //   // route level code-splitting
  //   // this generates a separate chunk (about.[hash].js) for this route
  //   // which is lazy-loaded when the route is visited.
  //   component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  // }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router
